﻿@model Mango.Manager.ViewModels.ManagerPageViewModel
<table class="table">
    <tbody>
        <tr>
            <td>
                <input type="button" class="btn btn-success" id="btn_Add" value="添加管理员" />
            </td>
        </tr>
    </tbody>
</table>
<table class="table  table-sm table-hover table-list table-bordered">
    <thead>
        <tr>
            <th>Id</th>
            <th>用户名</th>
            <th>角色名称</th>
            <th>操作</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var row in Model.ListData)
        {
            <tr>
                <td>
                    @row["AdminId"]
                </td>
                <td>
                    @row["AdminName"]
                </td>
                <td>
                    @row["RoleName"]
                </td>
                <td>
                    <a href="javascript:;" class="edit" data-name="@row["AdminName"]" data-roleid="@row["RoleId"]"><input type="hidden" class="hidId" value="@row["AdminId"]" />修改</a>
                    <a href="javascript:;" class="del"><input type="hidden" class="hidId" value="@row["AdminId"]" />删除</a>
                </td>
            </tr>
        }
    </tbody>
</table>        
    <script type="text/javascript">
        var roleData = null;
        $(window).ready(function () {
            $.ajax({
                type: 'post',
                url: '/ManagerAccount/GetRoleList',
                data: '',
                success: function (result) {
                    console.log(result);
                    roleData = JSON.parse(result);
                }
            });
        });
        //添加
        $("#btn_Add").click(function () {
            var html = '<table class="table">';
            html += '<tr><td>登录账号:</td><td><input type="text" id="add_name" class="form-control" style="width:200px;" value=""></td></tr>';
            html += '<tr><td>登录密码:</td><td><input type="text" id="add_password" class="form-control" style="width:200px;" value=""></td></tr>';
            html += '<tr><td>所属角色:</td><td><select id="add_role"  class="form-control" style="width:200px;">';
            $.each(roleData, function (i) {
                html += '<option value="'+roleData[i].RoleId+'">'+roleData[i].RoleName+'</option>';
            });
            html += '</select></td></tr>';
            html += '</table>';
            layer.open({
                type: 1,
                title: '添加账号:',
                shadeClose: true,
                content: html,
                btn: ['保 存'],
                btn1: function () {
                    $.ajax({
                        type: 'post',
                        url: '/ManagerAccount/Add',
                        data: 'roleId=' + $("#add_role").val() + '&adminName=' + $("#add_name").val() + '&password=' + $("#add_password").val(),
                        success: function (result) {
                            if (result) {
                                alert("添加成功");
                                window.location.href = window.location.href;
                            }
                        }
                    });
                }
            });
        });
        //修改数据
        $(".edit").click(function () {
            var id = $(this).find(" .hidId").val();
            var name = $(this).attr("data-name"); 
            var rid = $(this).attr("data-roleid");
            var html = '<table class="table">';
            html += '<tr><td>登录账号:</td><td><input type="text" id="edit_name" class="form-control" style="width:200px;" value="'+name+'"></td></tr>';
            html += '<tr><td>登录密码:</td><td><input type="text" id="edit_password" class="form-control" style="width:200px;" value=""></td></tr>';
            html += '<tr><td>所属角色:</td><td><select id="edit_role"  class="form-control" style="width:200px;">';
            $.each(roleData, function (i) {
                html += '<option value="' + roleData[i].RoleId + '" ' + (roleData[i].RoleId.toString() == rid ? 'selected="selected"' : '') + '>' + roleData[i].RoleName + '</option>';
            });
            html += '</select></td></tr>';
            html += '</table>';
            layer.open({
                type: 1,
                title: '编辑账号(密码不修改则留空):',
                shadeClose: true,
                content: html,
                btn: ['保 存'],
                btn1: function () {
                    $.ajax({
                        type: 'post',
                        url: '/ManagerAccount/Edit',
                        data: 'adminId=' + id + '&roleId=' + $("#edit_role").val() + '&adminName=' + $("#edit_name").val() + '&password=' + $("#edit_password").val(),
                        success: function (result) {
                            if (result) {
                                alert("编辑成功");
                                window.location.href = window.location.href;
                            }
                        }
                    });
                }
            });
        });
        //删除数据
        $(".del").click(function () {
            if (!confirm("确定删除该数据？")) {
                $(this).attr("href", "#");
            }
            else {
                var id = $(this).find(" .hidId").val();
                $.ajax({
                    type: 'post',
                    url: '/ManagerAccount/Delete',
                    data: 'adminId=' + id,
                    success: function (result) {
                        if (result) {
                            alert("删除成功");
                            window.location.href = window.location.href;
                        }
                    }
                });
            }
        });
    </script>